﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<fmt:setBundle basename="ApplicationMessage" />

<div class="modal-dialog" role="document" style="width: 1200px;">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      <h4 class="modal-title"><fmt:message key="assessor.64" /> <fmt:message key="assessor.456" /></h4>
    </div>
    <form class="form-horizontal" method="POST" action="${ctx.host}/sessions/${sessionCalibration.session.id}/supervisor-calibrations/${sessionCalibration.id}/edit-recommendations" data-validate="true">
      <input type="hidden" name="_method" value="PATCH">
      <input type="hidden" name="id" value="${comment.id}">
      <div class="modal-body competency-box">
        <ul class="list-unstyled instruction-list">
          <li><fmt:message key="assessor.417" /><%-- <a href=""><fmt:message key="assessor.418" /></a> --%></li>
          <li><fmt:message key="assessor.419" /></li>
        </ul>
        <c:set var="calibrationComment" value="${empty sessionReportWriting ? comment : sessionReportWriting.sessionReportComment}"/>
        <div class="col-xs-12">
          <div class="competency-summary" style="height: 550px;overflow-y: scroll; margin-top: 30px;">
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.420" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="strengthOne" class="form-control select2" data-placeholder="<fmt:message key="assessor.421" />" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.strengthOne eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthOneTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466"/>" value="${calibrationComment.strengthOneTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="strengthOneComment" data-type="strength" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.strengthOneComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio strongOne ${calibrationComment.selectedSuggests['strengthOne'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.470" />"><input type="checkbox" name="choose" value="strengthOne" ${calibrationComment.selectedSuggests['strengthOne'] != null ? 'checked' : ''} data-choose="strength" disabled> <fmt:message key="assessor.423" /></label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['strengthOne'] != null ? '' : 'hide'}" name="chooseComment" placeholder="<fmt:message key="assessor.424" />" data-validate="${calibrationComment.selectedSuggests['strengthOne']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['strengthOne']}</textarea>
                </div>
              </div>
            </div>
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.425" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="strengthTwo" class="form-control select2" data-placeholder="<fmt:message key="assessor.421"/>" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.strengthTwo eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthTwoTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466" />" value="${calibrationComment.strengthTwoTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="strengthTwoComment" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.strengthTwoComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio ${calibrationComment.selectedSuggests['strengthTwo'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.470" />"> <input type="checkbox" name="choose" ${calibrationComment.selectedSuggests['strengthTwo'] != null ? 'checked' : ''} data-type="strength" value="strengthTwo" disabled> <fmt:message key="assessor.423" />
                    </label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['strengthTwo'] != null ? '' : 'hide'}" name="chooseComment" placeholder="<fmt:message key="assessor.424" />" data-validate="${calibrationComment.selectedSuggests['strengthTwo']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['strengthTwo']}</textarea>
                </div>
              </div>
            </div>
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.426" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="strengthThree" class="form-control select2" data-placeholder="<fmt:message key="assessor.421" />" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.strengthThree eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthThreeTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466" />" value="${calibrationComment.strengthThreeTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="strengthThreeComment" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.strengthThreeComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio ${calibrationComment.selectedSuggests['strengthThree'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.470" />"> <input type="checkbox" name="choose" ${calibrationComment.selectedSuggests['strengthThree'] != null ? 'checked' : ''} data-type="strength" data-choose="strength" value="strengthThree" disabled> <fmt:message key="assessor.423" />
                    </label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['strengthThree'] != null ? '' : 'hide'}" name="chooseComment" data-type="strength" placeholder="<fmt:message key="assessor.424"/>" data-validate="${calibrationComment.selectedSuggests['strengthThree']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['strengthThree']}</textarea>
                </div> 
              </div>
            </div>
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.427" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="dnOne" class="form-control select2" data-placeholder="<fmt:message key="assessor.421" />" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.dnOne eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnOneTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466" />" value="${calibrationComment.dnOneTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="dnOneComment" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.dnOneComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio dnOne ${calibrationComment.selectedSuggests['dnOne'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.510" />"> <input type="checkbox" name="choose" ${calibrationComment.selectedSuggests['dnOne'] != null ? 'checked' : ''} value="dnOne" data-choose="development" disabled> <fmt:message key="assessor.423" />
                    </label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['dnOne'] != null ? '' : 'hide'}" name="chooseComment" placeholder="<fmt:message key="assessor.424" />" data-validate="${calibrationComment.selectedSuggests['dnOne']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['dnOne']}</textarea>
                </div>
              </div>
            </div>
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.428" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="dnTwo" class="form-control select2" data-placeholder="<fmt:message key="assessor.421" />" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.dnTwo eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnTwoTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466" />" value="${calibrationComment.dnTwoTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="dnTwoComment" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.dnTwoComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio ${calibrationComment.selectedSuggests['dnTwo'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.510" />"> <input type="checkbox" name="choose" ${calibrationComment.selectedSuggests['dnTwo'] != null ? 'checked' : ''} value="dnTwo" data-choose="development" disabled> <fmt:message key="assessor.423" />
                    </label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['dnTwo'] != null ? '' : 'hide'}" name="chooseComment" placeholder="<fmt:message key="assessor.424" />" data-validate="${calibrationComment.selectedSuggests['dnTwo']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['dnTwo']}</textarea>
                </div>
              </div>
            </div>
            <div class="form-group ihg-form-group">
              <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.429" /></label>
              <div class="col-xs-10">
                <div class="col-xs-6">
                  <select name="dnThree" class="form-control select2" data-placeholder="<fmt:message key="assessor.421" />" disabled>
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${calibrationComment.dnThree eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" /></option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnThreeTitle" style="margin-top: 10px;" class="selecte2 form-control" data-placeholder="<fmt:message key="assessor.466" />" value="${calibrationComment.dnThreeTitle}" disabled/>
                  <textarea class="form-control scorllbar-textarea" name="dnThreeComment" placeholder="<fmt:message key="assessor.422" />
                  " data-validate="required">${calibrationComment.dnThreeComment}</textarea>
                </div>
                <div class="col-xs-6">
                  <div class="radio ${calibrationComment.selectedSuggests['dnThree'] != null ? '' : 'hide'}">
                    <label data-toggle="popover" data-placement="bottom" data-content="<fmt:message key="assessor.510" />"> <input type="checkbox" name="choose" ${calibrationComment.selectedSuggests['dnThree'] != null ? 'checked' : ''} value="dnThree" data-choose="development" disabled> <fmt:message key="assessor.423" />
                    </label>
                  </div>
                  <textarea class="form-control scorllbar-textarea ${calibrationComment.selectedSuggests['dnThree'] != null ? '' : 'hide'}" name="chooseComment" placeholder="<fmt:message key="assessor.424" />" data-validate="${calibrationComment.selectedSuggests['dnThree']!=null ? 'required' : ''}">${calibrationComment.selectedSuggests['dnThree']}</textarea>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal"><fmt:message key="assessor.460" /></button>
        <button type="submit" class="btn btn-success" style="background: #70AD47;"><fmt:message key="assessor.462" /></button>
      </div>
    </form>
  </div>
</div>